import 'package:carousel_slider/carousel_slider.dart';
import 'package:flutter/widgets.dart';

import '../../../core/app_export.dart';
import '../../../widgets/app_bar/appbar_subtitle.dart';
import '../../../widgets/app_bar/custom_app_bar.dart';
import '../../../widgets/app_bar/outline_icon_button.dart';
import '../../../widgets/custom_outlined_button.dart';
import '../../../widgets/screen_state_widget.dart';
import '../../dashboard_container_screen/dashboard_container_screen.dart';
import '../../gyms_admins/add_gym_admin_page/bloc/add_admin_page_screen.dart';
import 'offers_cubit.dart';
import 'package:flutter/material.dart';

class OffersScreen extends StatelessWidget {
  final bool? isRequired ;
  const OffersScreen({Key? key,this.isRequired}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    double height = MediaQuery.of(context).size.height;
    double width = MediaQuery.of(context).size.width;
    var offersCubit =OffersCubit();
    return PopScope(
      canPop: isRequired != true,
      child: Scaffold(
        appBar:_buildAppBar(context:context ,cubit: offersCubit),
        body: BlocProvider<OffersCubit>(
          create: (context) =>offersCubit ..init(),
          child: BlocConsumer<OffersCubit, OffersState>(
            listener: (context, state) {
              if(state is OffersSelectDone){
                Navigator.of(context).pushAndRemoveUntil(MaterialPageRoute(builder: (context) =>
                    DashboardContainerScreen.builder(context)), (Route<dynamic> route) => false);
              }
              // TODO: implement listener
            },
            builder: (context, state) {
              var cubit = OffersCubit.get(context);
              return Container(
                height: height,
                width: width,
                decoration: BoxDecoration(
                  image: DecorationImage(
                    image: AssetImage(ImageConstant.imgBackground),
                    fit: BoxFit.cover,
                  ),
                ),
                child: ScreenStateWidget(
                  isDone: state is OffersDone,
                  isError: state is OffersError,
                  isLoading: state is OffersLoading,
                  onRefresh: cubit.getAllOffers,
                  onDone: CarouselSlider(
                    options: CarouselOptions(
                      autoPlay: false,
                      aspectRatio: 0.75,
                      enlargeCenterPage: true,
                    ),
                    items: cubit.offers.map((offer) {
                      return Builder(
                        builder: (BuildContext context) {
                          return Card(
                            elevation: 5,
                            color: Colors.black,
                            shape: RoundedRectangleBorder(
                              borderRadius: BorderRadius.circular(10),
                            ),
                            child: Container(
                              decoration: BoxDecoration(
                                borderRadius: BorderRadius.circular(10),
                              ),
                              width: MediaQuery.of(context).size.width,
                              margin: EdgeInsets.symmetric(horizontal: 5.0),
                              child: Column(
                                crossAxisAlignment: CrossAxisAlignment.start,
                                children: <Widget>[
                                  Expanded(
                                    flex: 2,
                                    child: SizedBox(
                                      width: MediaQuery.of(context).size.width,
                                      child: SingleChildScrollView(
                                        child: Column(
                                          children: [
                                            Padding(
                                              padding: const EdgeInsets.all(4.0),
                                              child: Text(
                                                offer.title,
                                                style: TextStyle(fontSize: 18.fSize, fontWeight: FontWeight.bold),
                                              ),
                                            ),
                                            Padding(
                                              padding: const EdgeInsets.all(0.0),
                                              child: Text(
                                                '${offer.price} ل.س',
                                                style: TextStyle(fontSize: 16.fSize, color: Colors.green),
                                              ),
                                            ),
                                            Padding(
                                              padding: const EdgeInsets.all(4.0),
                                              child: Text(
                                                "سنوي",
                                                style: TextStyle(fontSize: 16.fSize, fontWeight: FontWeight.normal),
                                              ),
                                            ),
                                          ],
                                        ),
                                      ),
                                    ),
                                  ),
                                  Expanded(
                                    flex: 4,
                                    child: SingleChildScrollView(
                                      child: Padding(
                                        padding: const EdgeInsets.symmetric(horizontal: 8.0),
                                        child: Text(
                                          offer.description,
                                          style: TextStyle(fontSize: 13.fSize),
                                        ),
                                      ),
                                    ),
                                  ),
                                  CustomOutlinedButton(
                                    margin: const EdgeInsets.all(8),
                                    text:(offer.price ==0)? "ابدأ التجربة":"اطلبها الآن",
                                    buttonTextStyle: theme.textTheme.titleMedium!
                                        .copyWith(color: Colors.orange,fontSize: 18.fSize),
                                    onPressed: () {
                                      cubit.selectOffer(offer);
                                    },
                                  )
                                ],
                              ),
                            ),
                          );

                        },
                      );
                    }).toList(),
                  ),
                ),

              );
            },
          ),
        ),
      ),
    );
  }

  /// Section Widget
  PreferredSizeWidget _buildAppBar({required BuildContext context, required OffersCubit cubit}) {
    return CustomAppBar(
      actions: [
        if(PrefUtils.isAdmin())
          OutlineIconButton(
            icon: Icons.add,
            margin:const EdgeInsets.all(8),
            padding:const EdgeInsets.all(2),
            onTapped: ()async{

            },
          ),
      ],
      leading:(isRequired==true)? null: OutlineIconButton(
        imagePath: ImageConstant.imgRightIcon,
        onTapped: (){
          Navigator.pop(context);
        },
      ),
      title: AppbarSubtitle(
        text: "اختر خطتك", margin: EdgeInsets.only(left: 12.h),
      ),
    );
  }

}
